<template>
    <div class="backup-settings">
      <h2>备份设置</h2>
      <el-form :model="backupSettings" label-width="100px">
        <el-form-item label="备份频率">
          <el-select v-model="backupSettings.frequency" placeholder="请选择">
            <el-option label="Daily" value="Daily"></el-option>
            <el-option label="Weekly" value="Weekly"></el-option>
            <el-option label="Monthly" value="Monthly"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="备份保留策略">
          <el-input-number v-model="backupSettings.retention" :min="1" :max="100" label="保留最近几份备份"></el-input-number>
        </el-form-item>
        <el-form-item label="备份通知设置">
          <el-switch v-model="backupSettings.notificationEnabled" :active-value="true" :inactive-value="false"></el-switch>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="handleSaveBackupSettings">保存</el-button>
        </el-form-item>
      </el-form>
    </div>
  </template>
  
  <script setup lang="ts">
  import { ref } from 'vue';
  
  const backupSettings = ref({
    frequency: 'Daily',
    retention: 5,
    notificationEnabled: true,
  });
  
  const handleSaveBackupSettings = () => {
    alert('保存备份设置');
  };
  </script>